@ant-tag: ant-tag;

@tag-1: #2ad181;
@tag-2: #fa9b47;
@tag-3: #815be4;
@tag-4: #18c4ec;
@tag-5: #2ad1c3;
@tag-6: #ff3b3b;
@danger: #ff0000;

.tint {
  --tag-1: @tag-1;
  --tag-2: @tag-2;
  --tag-3: @tag-3;
  --tag-4: @tag-4;
  --tag-5: @tag-5;
  --tag-6: @tag-6;
  --tag-color-1: #ffffff;
  --tag-color-2: #ffffff;
  --tag-color-3: #ffffff;
  --tag-color-4: #ffffff;
  --tag-color-5: #ffffff;
  --tag-color-6: #ffffff;
  --tag-border-1: @tag-1;
  --tag-border-2: @tag-2;
  --tag-border-3: @tag-3;
  --tag-border-4: @tag-4;
  --tag-border-5: @tag-5;
  --tag-border-6: @tag-6;
}
.dark {
  --tag-1: fade(@tag-1, 10%);
  --tag-2: fade(@tag-2, 10%);
  --tag-3: fade(@tag-3, 10%);
  --tag-4: fade(@tag-4, 10%);
  --tag-5: fade(@tag-5, 10%);
  --tag-6: fade(@tag-6, 10%);
  --tag-color-1: @tag-1;
  --tag-color-2: @tag-2;
  --tag-color-3: @tag-3;
  --tag-color-4: @tag-4;
  --tag-color-5: @tag-5;
  --tag-color-6: @tag-6;
  --tag-border-1: @tag-1;
  --tag-border-2: @tag-2;
  --tag-border-3: @tag-3;
  --tag-border-4: @tag-4;
  --tag-border-5: @tag-5;
  --tag-border-6: @tag-6;
}

.loop-tag(@n, @i: 1) when (@i =< @n) {
  .@{ant-tag}.tag-has-color-@{i} {
    color: ~'var(--tag-color-@{i})';
    border: ~'1px solid var(--tag-border-@{i})';
    background-color: ~'var(--tag-@{i})';
  }
  .loop-tag(@n, @i + 1);
}

.loop-tag(6);
